<template>
	<div class="coming-soon-page">
		<div class="content">
			<el-icon :size="80" class="icon">
				<Tools />
			</el-icon>
			<h2>功能开发中</h2>
			<p>该功能正在紧锣密鼓地开发中，敬请期待...</p>
		</div>
	</div>
</template>

<script setup lang="ts">
import { Tools } from '@element-plus/icons-vue';
</script>

<style scoped lang="scss">
.coming-soon-page {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 40px;

	.content {
		text-align: center;

		.icon {
			color: #667eea;
			margin-bottom: 20px;
		}

		h2 {
			font-size: 24px;
			color: #333;
			margin: 0 0 12px 0;
		}

		p {
			font-size: 14px;
			color: #999;
			margin: 0;
		}
	}
}
</style>
